<template>
    <div>
        <div class="header">
            <router-link to=""><img style="display: none"/></router-link>
<!--            <h2>水表报修</h2>-->
            <router-link class="sq" :to="{path:'/tap-water/apply',query:{reg:'农村'}}">申请报修</router-link>
        </div>
        <div class="sqbx_bt">
            <van-tabs v-model="activeName" swipeable type="card" color="#22c7da">
                <van-tab title="未处理" name="未处理">
                </van-tab>
                <van-tab title="处理中" name="处理中">
                </van-tab>
                <van-tab title="已处理" name="已处理">
                </van-tab>
            </van-tabs>
        </div>
        <div class="sqbx_list">
            <ul class="mui-table-view">
                <water-fix-table-list :region="region" :tag="activeName"></water-fix-table-list>
            </ul>
        </div>
    </div>
</template>

<script>
    export default {
        name: "countryside_repair",
        components: {waterFixTableList},
        data() {
            return {
                activeName: '未处理',
                region: "农村"
            }
        }
    }
    import Vue from 'vue';
    import {Tab, Tabs} from 'vant';
    import 'vant/lib/tab/style';
    import 'vant/lib/tabs/style';
    import waterFixTableList from '@/componets/water-fix-table';


    Vue.use(Tab);
    Vue.use(Tabs);

</script>

<style scoped>
    @import "../../assets/tap-water/css/base.css";
    @import "../../assets/tap-water/css/other.css";

    background {
        color: #fff;
    }
</style>